import React, { Component } from 'react'
import { Form, Input, Button, Checkbox, } from 'antd';
import LoginStyle from "./login.module.less";

import { rootlogin } from "./service.js"

class Login extends Component {

    denglu = async (userName, passWord) => {
        let { code, data, message } = await rootlogin(userName, passWord) || {}
        if (!code) {
            return alert(`${message} 用户名或密码错误`)
        }
        localStorage.setItem("token", data.token);
        this.props.history.replace("/home");
        alert("登录成功");
    }

    render() {
        return (
            <div className={LoginStyle.box}>
                <Form
                    name="basic"
                    labelCol={{
                        span: 7,
                    }}
                    initialValues={{
                        remember: true, // 默认记住用户名密码
                    }}
                    onFinish={(params) => {
                        let { username, password } = params
                        this.denglu(username, password)
                    }}
                >

                    <Form.Item
                        label="Username"
                        name="username"
                        rules={[
                            {
                                required: true,
                                message: '请输入你的用户名',
                            },
                        ]}>
                        <Input placeholder='admin' />
                    </Form.Item>
                    <Form.Item
                        label="Password"
                        name="password"
                        rules={[
                            {
                                required: true,
                                message: '请输入你的密码',
                            },
                        ]}>
                        <Input.Password placeholder='123456' />
                    </Form.Item>
                    <Form.Item
                        name="remember"
                        valuePropName="checked"
                        wrapperCol={{
                            offset: 8,
                            span: 16,
                        }}>
                        <Checkbox>记住我</Checkbox>
                    </Form.Item>
                    <Form.Item
                        wrapperCol={{
                            offset: 8,
                            span: 16,
                        }}>
                        <Button type="primary" htmlType="submit" onClick={() => {
                            console.log(this);
                        }}>
                            登录
                        </Button>
                    </Form.Item>

                </Form>
            </div>);
    }
}

export default Login;